<template>
  <Dialog ref="dialog" title="填报" width="800" class="tb-mh">
    <div style="padding: 24px 24px 16px 24px">
      <div style="margin: 0px 0 20px 0">
        {{
          studentData.studentName +
          '-' +
          studentInfo.province +
          '-' +
          (studentInfo.sex == 0 ? '男' : '女') +
          '-' +
          studentInfo.score +
          '分'
        }}
      </div>
      <el-table
        :data="tableData"
        stripe
        style="width: 100%"
        :header-cell-style="{ 'border-bottom': 'none' }"
        :header-row-style="{ height: '60px' }"
        :cell-style="{ height: '60px', 'border-bottom': 'none' }"
      >
        <el-table-column prop="batch" label="批次" align="center" />
        <el-table-column prop="score" label="省控线" align="center" />
        <el-table-column fixed="right" label="操作" align="center">
          <template #default="scope">
            <el-button
              v-if="scope.row.score <= studentInfo.score"
              type="primary"
              size="small"
              @click="handleClick(scope.row)"
              >创建方案</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
  </Dialog>
</template>
<script setup>
import Dialog from '@/components/Dialog/Dialog.vue';
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { batchInfo } from '@/api/leader/Filling.js';
import { ElMessage, ElMessageBox } from 'element-plus';
const router = useRouter();
const isGkbData = ref({});
const dialog = ref(null);
const tableData = ref([]);

// 父级传递的学生数据
const studentData = ref({});
// 学生信息
const studentInfo = ref({});

function handleClick(val) {
  if (
    studentData.value.student.graduate_time != isGkbData.value.graduate_time &&
    isGkbData.value.isGKB == 1
  ) {
    ElMessage({
      type: 'error',
      message: '高考年份不匹配',
    });
  } else {
    if (studentData.value.student.score < val.score) {
      ElMessageBox.confirm(
        `学生分数低于当前批次${val.batch}线分数，是否继续填报?`,
        '提示',
        {
          confirmButtonText: '是',
          cancelButtonText: '否',
          type: 'warning',
        }
      )
        .then(() => {
          let body = {
            batchInfo: val,
            studentData: studentData.value,
          };
          let jsonStr = JSON.stringify(body);
          jsonStr = btoa(encodeURIComponent(jsonStr));

          router.push({ path: '/leader/volunteerd', query: { data: jsonStr } });
        })
        .catch(() => {});
    } else {
      let body = {
        batchInfo: val,
        studentData: studentData.value,
      };
      let jsonStr = JSON.stringify(body);
      jsonStr = btoa(encodeURIComponent(jsonStr));

      router.push({ path: '/leader/volunteerd', query: { data: jsonStr } });
    }
  }
}

function openChange(val, isGkb) {
  isGkbData.value = isGkb;
  // 打开组件弹窗
  studentData.value = val;
  studentInfo.value = val.student;
  dialog.value.openChange();

  getBatchInfo();
}

// 获取批次线信息
function getBatchInfo() {
  let body = {
    provinceCode: studentData.value.gkaProvinceNumId,
    course: studentInfo.value.course,
    score: studentInfo.value.score,
  };
  batchInfo(body).then((res) => {
    tableData.value = res.data.batches;
  });
}

defineExpose({
  openChange,
});
</script>
<style lang="scss">
.tb-mh {
  .el-dialog {
    padding: 0;
  }
  .el-dialog__body {
    margin-top: 0;
    // padding: 24px 24px 16px 24px;
    .header {
      padding: 19px 30px;
    }
    .el-divider {
      margin: 0;
    }
  }
}
</style>
